<style>
.homeContain {
    padding: 100px 100px 0 100px;
    background-image: url("../assets/image/home-back.png");
}
.home_main {
    display: flex;
    background: white;
}

.aside_left_container {
    /* position: sticky;
    top: 0; */
    height: calc(100vh - 50px);
    height: 100vh;
    width: 150px;
    background: rgb(246, 247, 248);
}

.aside_left {
    width: 150px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    .aside_left_item {
        font-size: 18px;
        width: 150px;
        color: rgb(98, 102, 108);
        background: rgb(246, 247, 248);
        display: flex;
        justify-content: center;
        margin: 0px 10px;
        padding: 15px 0;
        border-radius: 10px;
    }

    .aside_left_item:hover {
        background: rgb(226, 228, 230);
    }

    .selected {
        background-color: white !important;
    }
}

.mid_container {
    width: 50%;
    display: flex;
    flex-direction: column;
    padding-left: 20px;
}
</style>
<template>
    <div class="homeContain">
        <HomeTop style="position: sticky;top: 0;" />
        <div class="home_main">
            <div class="mid_container">
                <div v-for="(item, index) in postItemData" :key="item.id" @click="toDetail(item.id)">
                    <PostItem :post="item" />
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import HomeTop from '../components/HomeTop.vue'
import PostItem from '../components/PostItem.vue'
import request from '@/utils/request'
import { newPage } from '@/utils/commonFunction'
import { CategoryEnum,getLabelByValue  } from '@/utils/commonEnum'
export default {
    components: {
        HomeTop,
        PostItem
    },

    data() {
        return {
            selected: 0,
            postItemData: [
                {
                    id: 1,
                    title: "(chatgpt) 两层 g c n 提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集",
                    content: `如果没有全连接层 ()c
                    层），那么输出将是每个节点的特征。这样的话，标签需要对应每个节点的输出特征。在这种情况下，标签的维度应该是节点数乘以输出特征数。如果我们将输出特征数设为 1 ，并且没有．．提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集`,
                    likeCount: 1,
                    nickname: "红豆面包",
                }, {
                    id: 2,
                    title: "(chatgpt) 两层 g c n 提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集",
                    content: `如果没有全连接层 ()c
                    层），那么输出将是每个节点的特征。这样的话，标签需要对应每个节点的输出特征。在这种情况下，标签的维度应该是节点数乘以输出特征数。如果我们将输出特征数设为 1 ，并且没有．．提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集提取最后一层节点输出特征，如何自定义简单数据集`,
                    likeCount: 1,
                    nickname: "红豆面包",
                }
            ],
            categoryId: null,
            params: {
                pageNum: 1,
            }
        }
    },
    mounted() {
        document.title = `分类页面 - ${getLabelByValue(this.$route.query.categoryId,CategoryEnum)}`;
    },
    created() {
        this.categoryId = this.$route.query.categoryId;
        this.getData();
    },
    methods: {
        toDetail(id) {
            let url = `/PostDetail?id=${id}`;
            newPage(url);
        },
        getData() {
            this.params.categoryId = this.categoryId;
            request.get("posts", {
                params: this.params
            }).then(res => {
                this.postItemData = res;
            });
        },
    },
}
</script>